---
title: Baggrund
---

import {Wrench,
	Book,
	Image,
	Globe,
	Gear,
	Plus,
	Trash,
	ArrowLeft,
	ArrowRight
	
} from "@phosphor-icons/react";
import logo from '/public/img/logo.svg';

To edit the background of a page, click on the <img alt="logo" src={logo.src} className="inline-icon" width="16"/> Butterfly button and then select <Image className="inline-icon"/> Background. On a computer, you can also use the shortcut `Ctrl+B`.

Backgrounds can be composed of multiple background layers, which are drawn on top of each other.

## Configuring Background Layers

On the Background screen, the first set of tabs shows the layers of the background.

To add a new layer, use the <Plus className="inline-icon"/> button.

To delete the selected layer, use the <Trash className="inline-icon"/> button.

To reorder the layers, use the <ArrowLeft className="inline-icon"/> and <ArrowRight className="inline-icon"/> buttons. Layers are drawn from left to right, so layers on the right will appear on top of layers on the left.

## Background Layer Types

There are two types of background layers: Patterns and Images/SVGs.

### Pattern Layers

There are many different pattern templates available that you can choose from. After selecting a pattern template, you can configure the following:

#### Baggrund

- Color - The color of the background of the pattern.
- Alpha - The alpha/opacity of the background of the pattern.

#### Horizontal / Vertical

These sections allow you to configure the appearance of grid lines.

- Color - The color of the grid lines.
- Alpha - The alpha/opacity of the grid lines.
- Width - The distance between grid lines.
- Count - The number of grid lines in a group. To prevent grouping, use `1`.
- Space - The distance between each group of grid lines.
- Stroke Width - The thickness/weight of the grid lines.

For example, to create sheet music staffs, you can use the following configuration:
`Width: 40`, `Count: 5`, `Space: 80`

### Image & SVG Layers

These background layer types allow you to upload an image and use it as background for the page. Images will be tiled on the canvas, and you can configure the scale of the image to make the tiles larger or smaller.
